﻿{//信息管理页}
<extend name="Public/template/base.html"/>
<block name='header'>
<include file="./Public/template/nav.html" info="active"/>
</block>
<block name='content'>

<div class="container col-xs-12">
 <section class="center-block">
 <div class="text-center row col-md-8 col-md-offset-2">
 <div class="well-lg">
     <h2>{$data['name']}<small>的个人信息</small></h2>
    <a href="__URL__/logout" class="btn btn-default">退出登录</a>
    <a href="mailto:feedback@print.nkumstc.cn" class="btn btn-default">信息有误?</a>
 </div>
</div>
 </section>
 <section class="center-block">
 <div class="row col-md-8 col-md-offset-2">
     <div class="panel panel-info">
         <div class="panel-heading">
             <h3 class="panel-title">认证信息</h3>
         </div>
         <div class="panel-body text-left">
         <ul>
            <li class="row"><span class='col-sm-2 col-xs-offset-1 label label-success'><i class="glyphicon glyphicon-user"></i>姓名</span><b class='col-sm-4 col-sm-offset-1 text-success'>{$data['name']}</b></li>
            <li class="row"><span class='col-sm-2 col-xs-offset-1 label label-success'><i class="glyphicon glyphicon-credit-card"></i>学号</span><b class='col-sm-4 col-sm-offset-1 text-success'>{$data['student_number']}</b></li>
            <li class="row"><span class='col-sm-2 col-xs-offset-1 label label-success'><i class="glyphicon glyphicon-map-marker"></i>学校</span><b class='col-sm-4 col-sm-offset-1 text-success'>{$data['school']}</b></li>
         </ul>
        </div>
    </div>
</div>
 </section>
  <section class="center-block">
    <div class="row col-md-8 col-md-offset-2">
    <div class="panel panel-primary">
     <div class="panel-heading">
     <h3 class="panel-title">绑定信息</h3>
    </div>
      <div class="panel-body bg-info text-left">
        <div class="detail row">
         <div class="col-sm-3 col-sm-offset-1"><i class="glyphicon glyphicon-phone"></i>手机</div>
         <span id='phone_detail' class='info col-sm-7 text-nowrap'><i class='btn glyphicon glyphicon-eye-open' id='getPhone'></i><u class='text-danger'>{$data['mask_phone']|default='<a class="bind">绑定手机</a>'}</u></span><span class='btn col-sm-1 glyphicon glyphicon-pencil'></span>
        </div>
        <div id='bind_phone' class='row input-group col-sm-offset-1 col-sm-10' style='display:none'> <label class="input-group-addon">+86</label><input id='phone' type="text" url='__URL__/bindPhone' name="phone" placeholder='你的手机号' class="form-control"/><span class="input-group-btn"><button onclick="bindPhone()" class='btn btn-success glyphicon glyphicon-check'>验证</button><span class='cancel btn btn-warning glyphicon glyphicon-remove'></span></span></div>
        <div class="detail row">
        	<div class='col-sm-3 col-sm-offset-1 text-nowrap'><i class="glyphicon glyphicon-envelope"></i>邮箱</div>
            <span id='email_detail' class='info col-sm-7'><i id='getEmail' class='btn glyphicon glyphicon-eye-open'></i><u class='text-danger'>{$data['mask_email']|default='<a class="bind">绑定邮箱</a>'}</u></span><span class='btn col-sm-1 glyphicon glyphicon-pencil'></span>
        </div>
        <div id='bind_email' class='row col-sm-offset-1 input-group col-sm-10' style='display:none'><input id="email" type="email" name="email" placeholder='你的常用邮箱' url='__URL__/bindEmail' class="form-control"/> <span class="input-group-btn"><button onclick="bindEmail()" class='btn btn-success glyphicon glyphicon-check'>验证</button><span class='cancel btn btn-warning glyphicon glyphicon-remove'></span></span></div>
     </div>
</div>
</div>
</section>
    <section>
        <div class="row col-md-8 col-md-offset-2">
         <div class="panel panel-danger">
         <div class="panel-heading">
             <h3 class="panel-title">密码管理</h3>
         </div>
         <div class="panel-body bg-warning text-left">
         <div>修改密码<i class='btn glyphicon glyphicon-pencil'></i></div>
        <form style='display:none' class="form-horizontal col-sm-offset-1" onsubmit="return changePwd(this);" role="form" method="post" action="__URL__/changePwd">
          <br/>
            <div class="input-group col-sm-10">
                <span class="input-group-addon" for="deprecated_password">当前密码</span>
                <input required="required" class="form-control" placeholder='正在使用的密码' name="deprecated_password" type="password" id="deprecated_password" required>
            </div>
            <div class="input-group col-sm-10">
                <span class="input-group-addon"  for="password">新的密码</span>
                <input class="form-control" placeholder='要设置的密码' name="password" type="password" id="password" required>
            </div>
            <div class="input-group col-sm-10">
                <span class="input-group-addon"  for="re_password">确认密码</span>
                <input  class="form-control" placeholder='重复刚设置的密码' type="password" id="re_password" required>
            </div>
            <input type="hidden" name="idMD5" value="0">
            <br/>
            <div class="input-group text-center">
                <button id="change" type="submit" class="btn btn-success">确定</button>
                <span class='cancel btn btn-warning'>取消</span>
            </div>
        </form>
</div>
</div>
</div>
</section>
</div>
<div class="modal fade" id="Modal" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h3 class="modal-title" id="ModalLabel">稍等……</h3>
            </div>
            <div class="modal-body">正在提交</div>
        </div>
    </div>
</div>
</block>
<BLOCK name='end'>
<script src="__PUBLIC__/js/md5.min.js" defer></script>
<script>
M = $('#Modal');
$('.glyphicon-pencil').click(function() {
    var info = $(this).parent();
    info.hide(50);
    info.next().show(100);
});
$('.bind').click(function(b){
	var info = $(this).parents('.detail');
    info.hide(50);
    info.next().show(100);
});
$('.cancel').click(function() {
    var set = $(this).parent().parent();
    set.hide(50);
    set.prev().show(100);
});
//绑定邮箱
function bindEmail() {
    var reg =/^[\w\.\-]{1,17}@[A-Za-z,0-9,\-,\.]{1,30}\.[A-Za-z]{2,6}$/;
    var p = $('[name="email"]');
    var email = p.val();
    if (!reg.test(email)) {
          var Mh = M.find('.modal-title');
        var Mb = M.find('.modal-body');
        Mh.html('邮箱格式不正确');
        Mb.html('请填写常见的邮箱格式，长度不超过37位');
        M.modal('show');
    } else {
        var Mh = M.find('.modal-title');
        var Mb = M.find('.modal-body');
        Mh.html('稍等...');
        Mb.html('正在给' + email + '发送验证信息...');
        M.modal('show');
        var url = p.attr('url');
        var data = {
            'email': email
        }
        p.attr('disabled', true);
        $.post(url, data, function(data, status) {
            if (status) {
                Mb.html(data.info);
                if (data.status) {
                    Mh.html('发送成功');
                    $('#email_detail').html(email + '(等待验证)');
                    $('#bind_email').hide(100).prev().show(100);
                } else {
                    Mh.html('发送失败');
                }
            } else {
                Mh.html('异常');
                Mb.html('服务器通讯异常！');
            }
        M.modal('show');
        p.attr('disabled', false);
        });
    }
}
//绑定手机
function bindPhone(type) {
    var reg = /^1[3458]\d{9}$/;
    var p = $('[name="phone"]');
    var phone = p.val();
    if (!reg.test(phone)) {
        M.find('.modal-title').html('手机号格式错误');
        M.find('.modal-body').html('请填写正确的手机号!<br/>仅支持大陆地区的真实手机号（禁止绑定虚拟运营商手机号）！');
        M.modal('show');
    } else {
        var Mh = M.find('.modal-title');
        var Mb = M.find('.modal-body');
        Mh.html('稍等...');
        Mb.html('正在给' + phone + '发送验证码...');
        M.modal('show');
        var url = p.attr('url');
        var data = {
            'phone': phone
        }
        p.attr('disabled', true);
        $.post(url, data, function(data, status) {
            if (status) {
                if (data.status) {
                        Mh.html('发送成功 验证手机');
                            Mb.html("<div class='input-group'><input id='sms_code' name='code' type='text' class='form-control' placeholder='六位数字验证码' autocomplete='off' required/><span class='input-group-btn'><button class='btn btn-success' onclick='verifySMSCode(this)'>开始验证</button><button id='resend' class='btn' onclick='bindPhone()' disabled>重发验证码</button></span></div><br>");
                        count(document.getElementById("resend"), 60);
                        M.modal('show');
                    }else{
                    Mh.html('发送失败');
                    Mb.html(data.info);
                }
            } else {
                Mh.html('异常');
                Mb.html('服务器通讯异常！');
            }
        M.modal('show');
        p.attr('disabled', false);
        });
    }
}
//短信验证
function verifySMSCode(b) {
    b.disabled = true;
    var c = $('#sms_code');
    var code = c.val();
    reg = /^\d{6}$/;
    if (!reg.test(code)) {
        alert('验证码是四到六位数字哦!');
    } else {
        var url = '/User/verifyPhone';
        var data = {
            'code': code,
        };
        $.post(url, data, function(d, status) {
            if (status) {
                if (d.status) {
                    M.find('.modal-title').html('验证成功');
                    M.find('.modal-body').html(d.info);
                    M.modal('show');
                    var pd = $('#phone_detail');
                    var bp = $('#bind_phone');
                    pd.html(bp.children('input').val());
                    bp.hide().prev().show(100);
                } else if(d.url) {
                    M.find('.modal-title').html('验证失败');
                    M.find('.modal-body').html(d.info);
                }else{
                    alert('验证失败:' + d.info);
                }
            } else {
                alert('服务器通讯异常！');
            }
        });
    }
    b.disabled = false;
}
//重发倒计时
        function count(btn, c) {
                if (c > 0) {
                                btn.innerHTML = (c--) + 's可重发';
                        setTimeout(function() {
                        count(btn, c);
                }, 1000);
                } else {
                    btn.removeAttribute("disabled");
                        btn.innerHTML = "重发验证码";
        }
};
//获取邮箱
$('#getEmail').click(function()
{
    $.get('/User/getEmail',null,function(data,status){
        if(status=='success'){
            if(data.status)
            {
                $('#email_detail').children('').html(data.info.email);
                $('#getEmail').hide();
            }else{
                M.find('.modal-title').html('查询失败');
                M.find('.modal-body').html(data.info);
                M.modal('show');
            }
        }else{
                M.find('.modal-title').html('服务器通讯异常！');
                M.find('.modal-body').html('检查网络，稍后重试');
                M.modal('show');
        }
    });
});
$('#getPhone').click(function(gp){
    $.get('/User/getPhone',null,function(data,status){
        if(status=='success'){
            if(data.status)
            {
                $('#phone_detail').children('').html(data.info.phone);
                $('#getPhone').hide();
            }else{
                M.find('.modal-title').html('查询失败');
                M.find('.modal-body').html(data.info);
                M.modal('show');
            }
        }else{
                M.find('.modal-title').html('服务器通讯异常！');
                M.find('.modal-body').html('检查网络，稍后重试');
                M.modal('show');
        }
    });
});
function changePwd(f) {
    var URL = f.action;

    var deprecated_password = f['deprecated_password'].value;
    var password = f['password'].value;
    var re_password = f.re_password.value;
    
    
    if(re_password == password)
    {
        $.post(URL, {
            deprecated_password : md5(deprecated_password),
            password: md5(password),
            isMD5:1
        }, function(data) {
            if (data.status) { 
                M.find('.modal-title').html('修改成功,即将跳转');
                M.find('.modal-body').html(data.info);
                M.modal('show');
                setTimeout(function() {location.href=data.url;}, 5000);
            } else {                
                M.find('.modal-title').html('修改失败');
                M.find('.modal-body').html(data.info);
                M.modal('show');
            }
        });

    }
    else
    {
                M.find('.modal-title').html('信息有误');
                M.find('.modal-body').html('两次密码不一致');
                M.modal('show');
    }
    return false;
}
</script>
</BLOCK>
